<template>
	<view class="bg container">
		<uv-status-bar></uv-status-bar>
		
		<h2 class="title t-center">数据精灵,助力诚信生活</h2>
		
		<Personal class="mb-30" />
		
		<!-- <Componey class="mb-30" /> -->
		
		<!-- <Consult class="mb-30" /> -->
		<uv-safe-bottom></uv-safe-bottom>
	</view>
</template>

<script setup>
	import Personal from '@/pages/home/components/Personal.vue'
	import Componey from '@/pages/home/components/Componey.vue'
	import Consult from '@/pages/home/components/Consult.vue'
</script>

<style lang="scss" scoped>
	.container {
		padding: 25rpx 25rpx 0 25rpx;
		height: auto;
		min-height: 100vh;
		
		.title {
			padding: 20rpx 0;
			margin-bottom: 40rpx;
			background-color: rgba(102, 66, 234, 1);
			border-radius: 123px;
			border-top-right-radius: 0px;
			border-bottom-left-radius: 0px;
			color: #fff;
			width: 425rpx;
			font: {
				size: 32rpx;
				family: "Sylfaen Bold Oblique", "Sylfaen Bold", "Sylfaen Normal", "Sylfaen", sans-serif;
				style: oblique;
			}
		}
		
		.card {
			padding: 25rpx 30rpx;
			border-radius: 25rpx;
			background-color: #fff;
			box-shadow: 0 0 10rpx rgba(0, 0, 0, .1);
			
			.card_tltle {
				flex-direction: row;
			}
			::v-deep {
				.card_tltle {
					flex-direction: row;
				}
			}
		}
	}
</style>
